import Vue from 'vue'
import VueRouter from 'vue-router'
// 导入 组件
import Login from '@/components/Login.vue'
import Home from '@/components/Home.vue'
import Welcome from '@/components/welcome.vue'
import Users from '@/components/user/Users.vue'
import Rights from '@/components/power/Rights.vue'
import Roles from '@/components/power/Roles.vue'
import Cate from '@/components/goods/Cate.vue'
import Params from '@/components/goods/params.vue'
import List from '@/components/goods/List.vue'
import Add from '@/components/goods/Add.vue'
import Order from '@/components/order/Order.vue'
import Report from '@/components/report/Report.vue'

Vue.use(VueRouter)

const router = new VueRouter({
  // 定义路由规则
  routes: [
    // Login 组件
    // 重定向路由规则 当访问  path 指定的'/'这个地址的时候，redirect 重定向到 '/login'
    { path: '/', redirect: '/login' },
    // 新增一个路由规则 path 指定路径，当用户访问 /login 路径的时候，通过 component 这个属性指定要展示的组件
    // 自动渲染到 App 跟组件中的站位符中
    { path: '/login', component: Login },

    // Home 组件
    {
      path: '/home',
      component: Home,
      redirect: '/welcome',
      children: [
        // 子路由
        { path: '/welcome', component: Welcome },
        { path: '/users', component: Users },
        { path: '/rights', component: Rights },
        { path: '/roles', component: Roles },
        { path: '/categories', component: Cate },
        { path: '/params', component: Params },
        { path: '/goods', component: List },
        { path: '/goods/add', component: Add },
        { path: '/orders', component: Order },
        { path: '/reports', component: Report },
      ],
    },
  ],
})

// 使用 beforeEach 方法即可 挂载一个路由前置导航守卫
// beforeEach 接收三个参数 to from next
// to   :是将要访问的路由信息对象
// from :是将要离开的路由信息对象
// next :是一个函数，调用 next() 表示放行，允许这次路由导航,next('/login')强制跳转
router.beforeEach((to, from, next) => {
  // to.path 用户访问的路径
  // 表示用户访问的路径是登录的 hath 地址 就不跳转，直接放行
  if (to.path == '/login') return next()
  // 先拿到 token ，根据是否有 token 在强制跳转
  const tokenStr = window.sessionStorage.getItem('token')
  if (!tokenStr) return next('/login') // 如果 token 不存在就 return 出去到 登录页面
  // 如果 token 存在就直接放行
  next()
})

export default router
